import './articleTag.less';

import React, { useEffect } from 'react';

import {
  Link,
  useDispatch,
  useSelector,
} from 'umi';

import { ArticleTagType } from '../../types/modules/article';

interface Props { }

function ArticleTag(props: Props) {
  const { } = props
  let dispatch = useDispatch()
  useEffect(() => {
    dispatch({
      type: "article/getArticleTagAll"
    })
  }, [])
  let { ArticleTag } = useSelector((state: { article: ArticleTagType }) => state.article)
  return (
    <div className='articleTag'>
      <h4 className='articleTag-h4'>
        文章标签
      </h4>
      <div className='articleTag-main'>
        {
          ArticleTag.map((item: ArticleTagType, index: number) => {
            return <Link to={`/tag/${item.value}`} className='articleTag-span' id='articleTag-span' key={item.id}>{item.label} [{item.articleCount}]</Link>
          })
        }
      </div>
    </div>
  )
}

export default ArticleTag
